<ul id="${parameters.id}" class="ztree"></ul>

<script type="text/javascript">

var setting,  zNodes = [];
<#if parameters.setting == "">
	var chkConfig, asyncConfig;
	<#if parameters.chkType == "check">
		chkConfig = {enable: true};
	</#if>
	<#if parameters.chkType == "radio">
		chkConfig = {enable: true, chkStyle: 'radio', radioType: 'all'};
	</#if>


	<#if parameters.async == "true">
		asynConfig = {enable:true, url: getTreeExpandUrl};
	<#else>
		asynConfig = {enable:false};
	</#if>
	setting = {check:chkConfig, data: {simpleData: { enable: true}}, async:asynConfig};
	
<#else>
	setting = ${parameters.setting};
</#if>


$(document).ready(function(){
	$.ajax({
		type: 'get',
		url: '${parameters.url}',
		async: false,
		success: function(data){ zNodes = data; },
		error: function(){alert('error on ajax call for root nodes...');}
	});

	$.fn.zTree.init($("#${parameters.id}"), setting, zNodes);
	
});
function getTreeExpandUrl(treeId, treeNode){
	return "${parameters.expandUrl}?id=" + treeNode.id;
}

</script>

